<!--
 * @docName: balanceQuery.vue
 * @Author: mwl
 * @Date: 2023/9/20
 * @LastEditors: zhongxiong
 * @LastEditTime: 11:02
-->
<template>
<div>
  <div class='content-box'>
    <div class='header-box' v-if='balanceConfig.protocolType==1 || balanceConfig.protocolType==3'>
      <div>
        <h2>渠道通用账户</h2>
      </div>
      <div class='flex-box'>
        <div>
          <template v-for='item in balanceConfig.balanceList'>
            <a-statistic style='color: #2f54eb;' v-if='item.accountType==1' title="账户余额" :precision="2" :value="Math.round(item.balance * 100)/10000" >
              <template #suffix>元</template>
            </a-statistic>
          </template>
        </div>
        <a-button v-has="'mac_acmge:click:cz'" type='primary' @click="$emit('goTo',{protocolType:'1',pagetab:'1'})">充值</a-button>
        <!--          <a-button style='margin-left: 10px;' @click='withdrawalFun()'>提现</a-button>-->
      </div>
    </div>
    <div class='header-box'>
      <div>
        <h2>渠道税费账户</h2>
      </div>
      <div class='flex-box'>
        <div>
          <template v-for='item in balanceConfig.balanceList'>
            <a-statistic style='color: #2f54eb;' v-if='item.accountType==2' title="账户余额" :precision="2" :value="Math.round(item.balance * 100)/10000" >
              <template #suffix>元</template>
            </a-statistic>
          </template>
        </div>
        <a-button v-has="'mac_acmge:click:cz2'" type='primary' @click="$emit('goTo',{protocolType:'1',pagetab : balanceConfig.protocolType == 1 ? '2' : balanceConfig.protocolType==2 ? '3' : balanceConfig.protocolType==3 ? '2' : ''})">充值</a-button>
        <!--          <a-button style='margin-left: 10px;' @click='withdrawalFun()'>提现</a-button>-->
      </div>
    </div>
    <div class='header-box' v-if='balanceConfig.protocolType==2 || balanceConfig.protocolType==3'>
      <div>
        <h2>企业账户</h2>
      </div>
      <div class='flex-box'>
<!--        <div>账户余额：<span>{{ Math.round(balanceConfig.balance * 100)/10000 }}</span>元</div>-->
        <a-button v-has="'mac_acmge:click:xzqy'" type='primary' style='margin-top: 2px;' @click="$emit('goTo',{protocolType:'2',pagetab:'1'})">选择企业</a-button>
        <!--          <a-button style='margin-left: 10px;' @click='withdrawalFun()'>提现</a-button>-->
      </div>
    </div>
  </div>
</div>
</template>

<script>
export default {
  name: 'balanceQuery',
  props:['balanceConfig'],
  data() {
    return {

    }
  }
}
</script>

<style scoped lang='less'>

/deep/.ant-statistic{
  display: flex;
  align-items: flex-end;
}
/deep/.ant-statistic-title{
  font-weight: bolder;
  color: @color-smudge;
}
/deep/.ant-steps-item-title{
  &:hover{
    cursor: pointer;
  }
}
/deep/.ant-statistic-content{
  margin-left: 20px;
  color: @color-blue;
}

.header-div{
  .content-box{
    display: flex;justify-content: start;
  }
  border-bottom: 1px solid #ccc;
  margin-bottom: 30px;
  .header-box{
    width: 30%;
    border: 1px solid #2f58cc;
    border-radius: 10px;
    margin: 20px 20px 20px 0;
    box-sizing: border-box;
    padding: 20px;
    background: #e2f3ff;
    .flex-box{
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    span{
      color: #4167E8;
      font-size: 30px;
      padding-right: 10px;
    }
  }
}
</style>
